<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>尺寸属性</title>
		<style>
			sp an{
				font-size: 100em;
				color: rgb(91, 91, 91,.1);
			}
			/* 尺寸属性：最大宽度与最小宽度，功能：【屏幕】自适应 
			
			*/
		div.container{
			background-color: #a5f7f7;
		}
		div.box{
			background-color: #ff0000;
			/*设置宽度：80%*/
			width: 80%;
			/*最大宽度属性：页面最大宽度值，如果与width同时出现，以最大宽度值*/
			max-width: 600px;
			/*最小宽度属性：页面最小宽度值，达到最小值，页面内容不会被压缩
			宽度与最小宽度同时出现，宽度大于最小宽度，宽度值以大的为准
			宽度与最大宽度和最小宽度同时出现，宽度>最大宽度>最小宽度，宽度值以大的为准
			*/
			min-width: 500px;
		}
		</style>
	</head>
	<body>
		<div class="container">
			<div class="box">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Accusamus illum architecto minima sunt dolores ipsa maxime eos impedit quis tempore officiis molestias alias eius cupiditate, perferendis corporis placeat, voluptatibus earum.</div>
		</div>
		<!-- 常用样式单位
		    1.针对尺寸：%，px 像素 em 移动端
			2.针对颜色:网页三原色：红，绿，蓝色，组成页面任意颜色
			rgb(0~255,0~255，0~255)
			十六进制写法：#rrggbb   0~9 a~z A~Z  常用：#000000 #ffffff
		 -->
		 <span>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Accusantium voluptatum, perferendis, est quibusdam, cum animi autem blanditiis doloremque a labore recusandae velit itaque nostrum ullam eligendi expedita numquam quisquam totam.</span>
	</body>
</html>